<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"
      layout:decorate="~{shared/layout}">
<head>
    <meta charset="UTF-8"/>
    <title>管理系统</title>
</head>
<body>
<div layout:fragment="content">
    <style>
        html, body {
            width: 100%;
            height: 100%
        }

        body {
            margin: 0;
            padding: 0;
            text-align: center;
            background: url(/custom/images/bg.jpg) no-repeat;
            background-size: 100% 100%;
            color: #000000;
            font-size: 14px;
            background-color: #fff !important;
        }

        .headerLogo {
            margin: 20px auto;
            width: 1000px;
            height: 10%;
            text-align: left;
            /*background: url(/custom/images/logo.png) no-repeat;*/
            /*background-size:5% 100%;*/
        }

        .headerLogo:after {
            content: "系统后台登录";
            font-size: 32px;
            height: 84px;
            line-height: 50px;
            color: white;
        }

        .layui-row {
            height: 85%;
        }
    </style>
    <div class="headerLogo">
        <img src="/custom/images/logo.png" alt="柠檬科技"
             style="width: 50px;height: 50px;border-radius: 50%;vertical-align: -12px;" >
    </div>
    <div class="layui-row">
        <div class="layui-col-xs6 layui-col-sm6  layui-col-md6 layui-col-lg6" style="height:100px;"></div>
        <div class="layui-col-xs6 layui-col-sm6  layui-col-md6 layui-col-lg6">
            <div style="margin:30px ;width:450px;background-color:white; padding:10px;border-radius:10px;margin-top:100px">
                <div style="text-align:center;line-height:50px;font-size:x-large;">
                    系统后台登录
                </div>
                <blockquote class="layui-elem-quote layui-quote-nm" style="text-align:left">
                    1、首次登录请用验证码登录<br/>2、登录后进入平台可以设置密码，设置后下次可以用密码登录！
                </blockquote>
                <div id="login" class="layui-tab layui-tab-card">
                    <ul class="layui-tab-title">
                        <li class="layui-this">密码登录</li>
                    </ul>
                    <div class="layui-tab-content">
                        <!--密码登录-->
                        <div class="layui-tab-item layui-show">
                            <form id="form1" class="layui-form" th:action="@{/system/login}" method="post">
                                <div class="layui-form-item">
                                    <label class="layui-form-label">用户编号</label>
                                    <div class="layui-input-inline" style="width:210px;">
                                        <input name="userName" id="mobile" type="text" maxlength="11" value="admin"
                                               class="layui-input"/>
                                    </div>
                                </div>
                                <div class="layui-form-item">
                                    <label class="layui-form-label">密码</label>
                                    <div class="layui-input-inline" style="width:210px;">
                                        <input name="userPassword" id="password" type="password" value="123456"
                                               class="layui-input"/>
                                    </div>
                                </div>
                                <div class="layui-form-item" style="text-align: center;">
                                    <input type="submit" class="layui-btn" value=" 登录 " id="loginBtn"/>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


<script type="application/javascript" layout:fragment="pagescript">
    layui.use(['element', 'layer'], function () {
        var $ = layui.$, element = layui.element, layer = layui.layer;
        var errMsg = "[[${error}]]";
        if (errMsg !== "") {
            layer.msg(errMsg, {icon: 2});
        }
    });
</script>

</body>

</html>
